<!DOCTYPE html>
<html lang="ch" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录我的账单</title>
    <link rel="shortcut icon" th:href="@{/img/favicon.ico}">
    <link th:href="@{/css/bootstrap/3.3.6/bootstrap.min.css}" rel="stylesheet">
    <link th:href="@{/css/layui/css/layui.css}" rel="stylesheet">
    <link th:href="@{/css/temp/login.css}" rel="stylesheet">
    <script th:src="@{/js/jquery/2.0.0/jquery.min.js}"></script>
    <script th:src="@{/js/vue/2.5.16/vue.min.js}"></script>
    <script th:src="@{/js/axios/0.17.1/axios.min.js}"></script>
    <script th:src="@{/js/temp/login.js}"></script>
    <script th:src="@{/js/layui/layui.js}"></script>
</head>
<body>
<div class="page-container">
    <div id="workArea">
        <div id="login_box">
            <div class="logo-container">
                <i class="layui-icon layui-icon-rmb" style="font-size: 36px; color: #8E37D7;"></i>
            </div>
            <h1>个人记账系统</h1>
            <p class="login-subtitle">欢迎回来，请登录您的账户</p>
            <div class="form">
                <div class="item">
                    <i class="layui-icon layui-icon-username"></i>
                    <input placeholder="用户名" v-model="user.name" type="text">
                </div>
                <div class="item">
                    <i class="layui-icon layui-icon-password"></i>
                    <input placeholder="密码" v-model="user.password" type="password">
                </div>
            </div>
            <button id="loginButton" @click="login">登录</button>
            <div id="toRegistered">
                <a th:href="@{/register}">还没注册？立即注册</a>
            </div>
        </div>
    </div>
</div>
</body>
</html>